<template>
    <div>
        <!-- 在没有照片的情况下 -->
        <div v-if="!list.length" style="height:150px;" class="componnent-no-data">【轮播图模块】请点击关联数据</div>
        <!-- 有照片的情况下 -->
        <el-carousel v-else height="150px">
            <el-carousel-item v-for="(item,index) in list" :key="index">
                <img  :src="item.src" style="width: 100%;height: 150px;">
                <!-- <div v-else style="height:150px;" class="componnent-no-data">暂无照片</div> -->
            </el-carousel-item>
        </el-carousel>
    </div>
</template>
<script>
    export default {
        props: {
            list: Array
        }
    }
</script>
<style>
     .componnent-no-data {
        border: 1px solid #cccccc;
        background-color: #eeeeee;
        color: #cccccc;
        display: flex;
        align-items: center;
        justify-content: center;
        /* padding: 15px 0; */
    }
</style>